<template>
	<view class="content">
		<view class="post">
			<uni-section title="我的帖子" type="line">
				<template v-for="item in myPosts" :key="item.id">
					<view @longpress="removePost(item)">
						<PostItemV2 :post="item" />
					</view>
				</template>
			</uni-section>
		</view>
		<!-- <view class="loading" v-show="!myPosts.length">空空如也～～</view> -->
		<van-empty description="暂无帖子" v-if="!myPosts.length" />
		<uni-popup ref="alertDialog" type="dialog">
			<uni-popup-dialog
				type="error"
				cancelText="取消"
				confirmText="确定"
				title="提示"
				content="确定删除这个帖子吗"
				@confirm="dialogConfirm"
			></uni-popup-dialog>
		</uni-popup>
	</view>
</template>

<script setup>
import { onLoad, onShow } from '@dcloudio/uni-app'
import { storeToRefs } from 'pinia'
import { ref } from 'vue'
	
import usePostStore from '@/store/post.js'
import PostItemV2 from '@/components/post-item-v2/post-item-v2.vue'
onShow(() => {
	postStore.queryMyPostsAction()
})

const postStore = usePostStore()
const { myPosts } =  storeToRefs(postStore)


// 移除帖子
const alertDialog = ref('')
const postId = ref('')
function removePost(item) {
	postId.value = item.id
	alertDialog.value.open()
}

function dialogConfirm() {
	postStore.removePostAction(postId.value)
}

</script>

<style lang="less">
.post {
	padding: 0 10rpx;
	.post-content {
		background-color: #F5F6F8;
	}
}
.loading {
	position: absolute;
	top: 60%;
	left: 50%;
	transform: translate(-50%, -50%);
}
</style>
